<template>
  <div>
    <el-tree
      :data="treeData"
      :props="defaultProps"
      @node-click="handleNodeClick">
    </el-tree>
  </div>
</template>

<script>
export default {
  data() {
    return {
      treeData: [],
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    };
  },
  created() {
    this.getMenuTree();
  },
  methods: {
    handleNodeClick(data) {
      console.log(data);
    },
    getMenuTree() {
      this.$http({
        url: this.$http.adornUrl('/product/category/list/tree'),
        method: 'get'
      }).then(({data}) => {
        if (data && data.code === 0) {
          console.log(data);
        } else {
          this.$message.error(data.msg)
        }
      })
    }
  }
};
</script>

<style scoped>

</style>
